<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@include file="../base/base.jspf" %>
<link rel="stylesheet" type="text/css" href="${ctx}/static/css/style.css"/>
<div class="layui-form" style="padding: 47px 0 0 70px;">
    <input type="hidden" name="assId" value="${association.assId}"/>
    <input type="hidden" id="association-associationSubmitPage-ids" name="ids" value="${ids}"/>

    <div class="layui-col-xs6">
        <div class="layui-form-item">
            <label class="layui-form-label">协会名称</label>
            <div class="layui-input-inline">
                <input type="text" value="${association.assName}" name="assName" lay-verify="required"
                       placeholder="请输入协会名称"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">负责人</label>
            <div class="layui-input-inline">
                <input type="text" value="${association.assPrincipal}" name="assPrincipal" lay-verify="required"
                       placeholder="请输入负责人"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">负责人电话</label>
            <div class="layui-input-inline">
                <input type="text" value="${association.assPrincipalMobile}" name="assPrincipalMobile" lay-verify="required|phone"
                       placeholder="请输入负责人电话"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">地址</label>
            <div class="layui-input-inline">
                <input type="text" value="${association.assAddress}" name="assAddress"
                       placeholder="请输入地址"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">小程序id</label>
            <div class="layui-input-inline">
                <input type="text" value="${association.assWxAppId}" name="assWxAppId"
                       placeholder="请输入地址"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">小程序密钥</label>
            <div class="layui-input-inline">
                <input type="text" value="${association.assWxAppSecret}" name="assWxAppSecret"
                       placeholder="请输入地址"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">微信支付证书</label>
            <div class="layui-input-inline">
                <input type="text" id = "assWxApiclientKeyPath" value="${association.assWxApiclientKeyPath}" name="assWxApiclientKeyPath"
                       readonly class="layui-input"/>
                <button type="button" class="layui-btn demo-class-accept" lay-options="{accept: 'file'}">
                    <i class="layui-icon layui-icon-upload"></i>
                    上传文件
                </button>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商户号id</label>
            <div class="layui-input-inline">
                <input type="text" value="${association.assWxMchId}" name="assWxMchId"
                       placeholder="请输入地址"
                       class="layui-input"/>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">商户号序列号</label>
            <div class="layui-input-inline">
                <input type="text" value="${association.assWxSerialId}" name="assWxSerialId"
                       placeholder="请输入地址"
                       class="layui-input"/>
            </div>
        </div>

        <%--<div class="layui-form-item">
            <label class="layui-form-label">协会图片</label>
            <div class="layui-col-xs6">
                <div class="text-center" id="clickToUploadHead">
                    <a href="javascript:void(0);" class="upimg-a">
                        <img style="height: 250px; width: 250px;" src="${ctx}${association.associationUrl}"
                             id="association-associationSubmitPage-associationHead"
                             class="thumbnail"
                             onerror="javascript:this.src='${ctx}/static/images/pic-default.jpg';">
                        <div class="upimg-shade">
                    <span style="margin-left: 20%;">
                      点击上传
                    </span>
                        </div>
                    </a>
                </div>
            </div>
        </div>--%>
    </div>
    <div class="layui-col-xs6" style="float: right;">
        <div class="text-center">
            <ul id="association-associationSubmitPage-ztree" class="ztree"></ul>
        </div>
    </div>
    <div class="layui-form-item layui-hide">
        <input type="button" lay-submit id="association-front-submit" lay-filter="association-front-submit" value="确认"/>
    </div>
</div>

<script type="text/javascript">
    layui.config({
        base: "${ctx}/static/framework/layuiadmin/" //静态资源所在路径
    }).extend({
        index: "lib/index" //主入口模块
    }).use(["index", "form","upload","laydate"], function () {
        var upload = layui.upload, form = layui.form,laydate = layui.laydate;

        upload.render({
            elem: '.demo-class-accept', // 绑定多个元素
            url: "${ctx}/association/uploadFile", // 此处配置你自己的上传接口即可
            accept: 'file', // 普通文件
            done: function(res){
                layer.msg('上传成功');
                console.log(res);
                $("input[name='assWxApiclientKeyPath']").val(res.path);
            }
        });

        upload.render({
            elem: "#clickToUploadHead",
            url: "${ctx}/association/uploadFile",
            multiple: true,
            accept: "images",
            acceptMime: "image/*",
            size: 2048,//限制文件大小，单位 KB
            type: "post",
            done: function (result) {

                $("#association-associationSubmitPage-associationHead").attr("src", "${ctx}" + result.path);

                $("input[name='associationUrl']").val(result.path);
            }
        });

        form.on("submit(association-front-submit)", function (data) {
            $("#association-front-submit").attr("disabled", true);
            tip_index = load();
            var field = data.field; //获取提交的字段
            $.ajax({
                async: true,
                url: "${ctx}/association/associationSubmit",
                type: "post",
                dataType: "json",
                data: field,
                success: function (data) {
                    layer.close(tip_index);
                    if (data.result) {
                        parentTableReload("association-associationList-page");
                        successUp(data.info);
                        closeDialog();
                    } else {
                        $("#association-front-submit").attr("disabled",false);
                        error(data.info);
                    }
                }
            });
        });

        var setting_ztree = {
            data: {
                simpleData: {
                    enable: true
                }
            },
            check: {
                enable: true,
                chkboxType: {
                    "Y": "ps",
                    "N": "ps"
                }
            },
            callback: {
                onClick: zTreeOnClick
            }
        };

        function initCheckNode() {
            var ids = $("#association-associationSubmitPage-ids").val();
            if (ids) {
                var zTree = $.fn.zTree.getZTreeObj("association-associationSubmitPage-ztree");
                ids = ids.split(",");
                for (var i = 0; i < ids.length; i++) {
                    var resId = ids[i];
                    var node = zTree.getNodeByParam("id", resId, null);
                    if (node) {
                        zTree.checkNode(node, true, false, false);
                    }
                }
            }
        }

        function showTreeForAssociation() {
            $.ajax({
                async: false,
                url: "${ctx}/resource/getResTree",
                type: "post",
                dataType: "json",
                data: {
                    enable: "1"
                },
                success: function (data) {
                    $.fn.zTree.init($("#association-associationSubmitPage-ztree"), setting_ztree, data);
                    var ztree = $.fn.zTree.getZTreeObj("association-associationSubmitPage-ztree");
                    ztree.expandNode(ztree.getNodes()[0], true, false, false, false);
                }
            });
        }
        function zTreeOnClick(event, treeId, treeNode) {
            var ztree = $.fn.zTree.getZTreeObj("association-associationSubmitPage-ztree");
            if (treeNode.checked) {
                ztree.checkNode(treeNode, false, true, false);
            } else {
                ztree.checkNode(treeNode, true, true, false);
            }
        }

        $(function () {
            showTreeForAssociation();
            initCheckNode();
        });
    });

    function getIds() {
        var zTree = $.fn.zTree.getZTreeObj("association-associationSubmitPage-ztree");
        var resId = zTree.getCheckedNodes();
        if (resId.length > 0) {
            var res_id = null;
            var ids = "";
            for (var i = 0; i < resId.length; i++) {
                res_id = resId[i].id;
                if (res_id != "0") {
                    ids += "," + res_id;
                }
            }
            $("#association-associationSubmitPage-ids").val(ids.substring(1));
        } else {
            $("#association-associationSubmitPage-ids").val("");
        }
    }
</script>
